import React, { useState, useEffect } from 'react'
import { Col, Form, Input, Button, message, Table, Modal, Select, } from 'antd'
import { PageHeaderWrapper } from '@ant-design/pro-layout'
import RenderButtom from '@/components/RenderButton'
import SearchBox from '@/components/SearchBox'
import {
  fetchDeliveryList,
  addDelivery,
} from '@/services/setting/trans'
import { formItemLayout } from '@/utils/utils'

const hasSearchBtn = JSON.parse(localStorage.getItem('hasSearchBtn'))
const { Option } = Select
const col = [
  {
    title: '序号',
    dataIndex: 'sort',
    key: 'sort',
    render: t => <>{t + 1}</>
  },
  {
    title: "配送公司",
    dataIndex: 'cityDeliveryName',
    key: "cityDeliveryName",
  },
  {
    title: "创建时间",
    dataIndex: 'createTime',
    key: "createTime",
  },
]
const Delivery = props => {
  const { form } = props
  const { getFieldDecorator } = form
  const [data, setData] = useState([])
  const [visible, setVisible] = useState(false)

  useEffect(() => {
    init()
  }, [])

  const init = async params => {
    const res = await fetchDeliveryList(params)
    res.code == 0 ? setData(res.data) : message.warning(res.msg)
  }

  // 按钮处理
  const handleBtn = type => {
    switch (type) {
      case 1:
        return setVisible(!visible)    
      default:
        break;
    }
  }
  const handleAdd = e => {
    e.preventDefault()
    form.validateFields((err, values) => {
      console.log('Received values of form: ', values)
      addDelivery({
        busCityDeliveryType: {
          ...values
        }
      }).then(res => {
        message.info(res.msg)
        setVisible(!visible)
      })
    })
  }
  return (
    <PageHeaderWrapper>
      {/* <SearchBox handleReset={handleReset} handleSearch={handleSearch} getFields={getFields} /> */}
      <RenderButtom click={handleBtn} />
      <Table 
        columns={col}
      />
      <Modal
        title="新增"
        visible={visible}
        onOk={handleAdd}
        onCancel={() => setVisible(!visible)}
        destroyOnClose
      >
        <Form {...formItemLayout}>
          <Form.Item label='配送公司'>
            {getFieldDecorator('cityDeliveryName', {
            })(<Select>
              <Option value={'闪送'}>闪送</Option>
            </Select>)}
          </Form.Item>
        </Form>
      </Modal>
    </PageHeaderWrapper>
    )
}

export default Form.create()(Delivery)
